Skip to main content

Platform Capabilities on Local

When running nx serve <widget> locally, there is no real Online Banking (OLB) web application. The web harness (@cdx-extensions/di-sdk-web) provides all platform capabilities through mock data and simulated behaviour.

For setup instructions and local development commands, see the CDX Extensibility Apps repository README.

Here is exactly what each capability maps to:

Widget calls sdk.useUserContext()
        │
        ▼
di-sdk detects web environment → delegates to WebPlatform (harness)
        │
        ▼
WebPlatform reads:
node_modules/@cdx-extensions/di-sdk-web/dist/mocks/userContext.json
→ returns mock user data to widget
Widget calls sdk.useBranding('branding-1')
        │
        ▼
WebPlatform reads:
node_modules/@cdx-extensions/di-sdk-web/dist/mocks/branding-1.json
→ builds MUI theme and returns it
Widget calls httpClient.get('/api/demo/account-summary')
        │
        ▼
WebPlatform reads:
node_modules/@cdx-extensions/di-sdk-web/dist/mocks/apiResponses.json
→ returns mock response with simulated delay (500ms–2000ms)

Mock data files​

FilePurpose
node_modules/@cdx-extensions/di-sdk-web/dist/mocks/userContext.jsonMock logged-in user returned by useUserContext()
node_modules/@cdx-extensions/di-sdk-web/dist/mocks/apiResponses.jsonAll mock API endpoint responses used by getHttpClient()
node_modules/@cdx-extensions/di-sdk-web/dist/mocks/branding.jsonDefault branding/theme
node_modules/@cdx-extensions/di-sdk-web/dist/mocks/branding-1.json through branding-5.jsonNamed branding variants for useBranding(id)
tip

These files are inside node_modules so they will be reset on npm install.

Sample mock user context (userContext.json)​

{
  "guid": "user-a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "firstName": "mohan",
  "lastName": "shyam",
  "userName": "amahon",
  "fullName": "mohan shyam",
  "institutionUserId": "user-a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "email": "[email protected]",
  "institutionUserRole": "user",
  "institutionUserType": "premium",
  "institutionId": "inst-123"
}

Modify this file to simulate different users (e.g. admin role, different institution) during local development.

info

Only use the strings above. Additional strings are currently unsupported.

Next Steps​